import React from 'react';
import { ShieldIcon, UsersIcon, BookOpenIcon } from 'lucide-react';
export const ValueProposition = () => {
  return <section className="py-16">
      <div className="text-center mb-12">
        <h2 className="font-nunito font-semibold text-2xl md:text-3xl text-dark mb-4">
          Why Parents Trust CubHouseBuy
        </h2>
        <p className="font-inter text-gray-600 max-w-2xl mx-auto">
          We understand the challenges of finding the right products for your
          little ones. That's why we've created a trusted resource for all
          parents.
        </p>
      </div>
      <div className="grid grid-cols-1 md:grid-cols-3 gap-8">
        <div className="bg-white rounded-lg p-6 shadow-sm border border-gray-100 flex flex-col items-center text-center">
          <div className="w-16 h-16 rounded-full bg-yellow/20 flex items-center justify-center mb-4">
            <ShieldIcon size={28} className="text-yellow" />
          </div>
          <h3 className="font-nunito font-semibold text-xl mb-2">
            Safety First
          </h3>
          <p className="text-gray-600">
            Every product we recommend undergoes rigorous safety checks and
            meets the highest standards for your peace of mind.
          </p>
        </div>
        <div className="bg-white rounded-lg p-6 shadow-sm border border-gray-100 flex flex-col items-center text-center">
          <div className="w-16 h-16 rounded-full bg-coral/20 flex items-center justify-center mb-4">
            <UsersIcon size={28} className="text-coral" />
          </div>
          <h3 className="font-nunito font-semibold text-xl mb-2">
            Parent-Approved
          </h3>
          <p className="text-gray-600">
            Real parents test and review all products, providing honest feedback
            from those who understand your needs.
          </p>
        </div>
        <div className="bg-white rounded-lg p-6 shadow-sm border border-gray-100 flex flex-col items-center text-center">
          <div className="w-16 h-16 rounded-full bg-green/20 flex items-center justify-center mb-4">
            <BookOpenIcon size={28} className="text-green" />
          </div>
          <h3 className="font-nunito font-semibold text-xl mb-2">
            No-Nonsense Guides
          </h3>
          <p className="text-gray-600">
            Clear, straightforward advice that cuts through the marketing hype
            and helps you make informed decisions.
          </p>
        </div>
      </div>
    </section>;
};